<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="../taglib.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>角色管理</title>
</head>
<body>
	<div class="search-wrap">
		<form id="schForm">
        	<table class="search-tab">
				<tr>
					<th>角色名:</th><td id="txtRoleNameSch">
						<input type="text" name="roleNameSch">
					</td>
					<th>角色类型:</th><td id="txtRoleTypeSch">
						<select name="roleTypeSch">
							<option value="">-请选择-</option>
							<option value="1">个人角色</option>
							<option value="2">用户组角色</option>
						</select>
					</td>
					<td>
						<button type="button" id="schBtn">查询</button>
					</td>
				</tr>
       		</table>
       </form>
   	</div>
   	<div class="result-wrap">
   		<div class="grid-bar">
			<rms:role operateCode="add">
	        	<button id="addBtn">添加角色</button>
            </rms:role>
		</div> 
		<div class="result-content">
			<div id="grid"></div>
		</div>
   </div>
   
   	<div id="crudWin">
	<form id="form">
    	<table>
    		<tr>
    			<td><i class="require-red">*</i>角色名</td>
    			<td> <input name="roleName"
    			rules="[{rule:{notNull:true},errorMsg:'角色名不能为空'}
					,{rule:{minLength:2,maxLength:50},errorMsg:'角色名长度必须为2~50'}
					]" type="text"/></td>
    		</tr>
    	</table>      
      </form>
    </div>

	<div id="delDialog" style="display: none;">
		<span class="require-red">删除后,以下成员将失去该角色及对应的功能.确定删除吗?</span>
    	<div id="delGrid"></div>		
	</div>

<script type="text/javascript" src="js/SelectRightWin.js?v=<%=Math.random() %>"></script>

<script type="text/javascript">

VUI.use(['PageForm'],function(){
	var grid; // 表格
	var schForm; // 查询form
	var win;// 编辑表单
	var delGrid;
	var delDialog;

	var listUrl = ctx + 'listRRole.do'; // 查询
	var addUrl = ctx + 'addRRole.do'; // 添加
	var delUrl = ctx + 'delRRole.do';
	var listRoleRelationInfoUrl = ctx + 'listRoleRelationInfo.do';

	var ROLE_TYPE = {'1':'个人角色','2':'用户组角色'}
	
	schForm = new VUI.Form({
		formId:'schForm'
	});
	
	grid = new VUI.Grid({
		renderId:'grid'
		,url:listUrl
		,width:600
		,striped:true // 斑马线
		,pagination :true
		,columns:[[
			{title:"角色名",field:"roleName",width:200}
			,{title:"角色名",field:"roleType",width:200,formatter:function(val,obj){
				return ROLE_TYPE[val];
			}}
			,{title:'操作',field:'',sortable:false,formatter : function(value,obj){
				var updateStr = '<span class="grid-command btn-setRight">设置权限</span>';
              	var delStr = '<span class="grid-command btn-del">删除</span>';
              	if(obj.isAdmin) {
              		delStr = '';
              	}
              	return RightUtil.auth('grid_setRight',updateStr,'') 
              		+ RightUtil.auth('grid_del',delStr,'') ;
            }}
		]]
	});
	
	//监听事件，删除一条记录
    grid.on('ClickCell',function(ev) {
		var sender = $(ev.target); //点击的Dom
        if (sender.hasClass('btn-setRight')) {
        	var record = ev.row;
        	SelectRightWin.show(record.roleId,function(){
        		grid.reload();
        	});
        }
        if (sender.hasClass('btn-del')) {
        	var record = ev.row;
        	del(record);
        }
    });
	
    win = new VUI.Dialog({
		contentId:'crudWin'
		,title:'添加'
		,width:300
		,onOk:function() {
			save();
		}
	});
	
	pageForm = new VUI.PageForm({
		formId:'form'
		,grid:grid
		,win:win
		,crudUrl:{
			add:addUrl
		}
	});

    $('#schBtn').click(function(ev) {
        search();
    });
    
    $('#addBtn').click(function(ev) {
		add();
	});
    
//////// functions ////////
    
    function search() {
    	var param = schForm.getData();
    	grid.load(param);
    }
	
	function add(){
       pageForm.add();
    }
    
    function save() {
    	pageForm.save();
    }
    
    function del(row) {
    	if (row){
    		var userRoles = listRoleUser(row);

    		if(userRoles.length > 0){
    			initDelGrid();
    			
    			delGrid.loadData(userRoles);
    			
    			initDelDialog();
    			
    			var title = '删除[<span style="color:red;">'+row.roleName+'</span>]角色';
    			delDialog.setTitle(title);
    			
    			delDialog.set('onOk',function(){
    				doDel(row);
    			});
    			
    			
    			delDialog.show();
    		}else{
    			VUI.Msg.confirm('确认','确定删除角色['+ row.roleName +']吗?',function(r){
    				if(r) {
	    				doDel(row);
    				}
    			});
    		}
    	}
    }

    function doDel(delRow){
    	if(delRow){
    		Action.post(delUrl,delRow,function(result){
    			Action.execResult(result,function(){
    				VUI.Msg.alert('提示','删除成功',function(){
    					if(delDialog){
	    					delDialog.close();
    					}
    					grid.reload();
    				});
    			});
    		});
    	}
    }
    
    function listRoleUser(row){
    	var ret = [];
    	
    	Action.postSync(listRoleRelationInfoUrl
    			,{roleId:row.roleId},function(result){
    		if(result.rows.length > 0){
    			ret = result.rows;
    		}
    	});
    	
    	return ret;
    }
    
    function initDelGrid() {
		if(!delGrid){
			delGrid = new VUI.Grid({
				renderId:'delGrid'
				,height:300
				,columns:[[
					{title:"用户名",field:"username",width:200}
				]]
			});
		}
	}
    
    function initDelDialog() {
		if(!delDialog) {
			
			delDialog = new VUI.Dialog({
				contentId:'delDialog'
				,width:400
				,height:400
			});
		}
	}
	
});

</script>
</body>
</html>